<!--
 * @Description: 
 * @Author: charles
 * @Date: 2020-11-03 12:36:26
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2021-09-29 14:43:16
-->
<template>
  <div class="home">
    <div class="slideshow">
      <el-carousel :interval="5000" arrow="always">
      <el-carousel-item v-for="item in 6" :key="item">
      </el-carousel-item>
    </el-carousel>
    </div>

    <div class="wrapper">
      <!-- 游学项目 -->
      <div class="project">
        <div class="title">精选游学项目</div>
        <div class="content" v-for="item in 3" :key="item">
          <div class="pic">
            <img width="100%" src="http://121.199.29.84:8888/group1/M00/00/14/rBD-SV-qNeyAC1-iAAEA1cyOSgM303.jpg" alt="">
          </div>
          <div class="text">
            <div style="font-weight:700">新西兰海外游学多好玩，光是奥克兰就值得停留一周！</div>
            <div>2021-11-01 ~ 2020-11-10</div>
            <div>伦敦是极具活力和历史感的英国多元文化城市。游览女王白金汉宫，
              在牛津街购物感受最新流行趋势。我们宽敞的校园环境，距离伦敦眼，大本钟等知名地标步行可达。</div>
          </div>
        </div>
      </div>
    <!-- 常见问题区域  -->
    <div class="question">
      <div class="box">
        <div class="title">常见问题</div>
        <div class="question">孩子年龄太小去暑期游学合适吗？夏令营的时候怎么保障安全？</div>
        <p>其实年龄小的时候多出去是非常有利于孩子的身心的，能够在成长阶段多看看外面的世界、多吸收不同的文化、学习不同的思维方式。孩子的适应性和应变能力有的时候比大人想象的要强很多，但是在家里由于长辈的呵护而得不到锻炼，出去和别的小朋友一起学习独立，学习怎么成为集体的一分子，学习平等待人，这对少儿和青少年的长成都很有帮助。大多数家长担心的会是小孩子出去的安全问题，所以建议在选择夏令营团的时候务必仔细。英孚在这方面有50多年的经验，出发会有国内领队带团；而国外夏令营的学校都是英孚自己的学校，海外的领队也是学校精心挑选的人，全程都是英孚的工作人员负责。家长甚至可以通过MyEF系统登陆看到整个夏令营团队的课程、活动规划、寄宿家庭信息等，全程追踪，而领队也会随时和家长保持联系。</p>
        <div class="pic">
          <img src="../assets/yxtx/question1.jpg" alt="图片丢失">
        </div>
      </div>
      <div class="box">
    
        <div class="question">参加夏令营到底有什么好处？</div>
        <p>国外流行的游学夏令营一般都是有一个主题的，宗旨是让一群年轻的小朋友聚在一起，在导师的带领下参加围绕该主题的活动，促进友谊的同时，可以和有共同兴趣爱好的人一起学习、交流分享。所以夏令营是让孩子们拓展视野的好时机，比如你的小孩从小就有表演天分，可是作为家长却不知道应该怎么做让她/他进一步的发挥，那参加表演艺术主题的夏令营就可以给予一定的指导和空间，甚至会安排小舞台让她/他进行表演，而往往因这样的机缘巧合也会更加容易收获真挚的友情。EF英孚夏令营除了有学习语言为主的夏令营活动，也有各式主题类型的国际夏令营，比如足球夏令营、探险夏令营、冲浪夏令营、马术夏令营、表演明星课程、时尚和艺术工作室等。</p>
        <div class="pic">
          <img src="../assets/yxtx/question1.jpg" alt="图片丢失">
        </div>
      </div>
    </div>
  </div>
</div>

</template>
<script>
export default {
  
}
</script>

<style lang="scss">
.slideshow{
    .el-carousel__item:nth-child(3) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/4B/rBD-SWDdx1CAI4RKAASw65m4_Ts01.jpeg);
    }
    .el-carousel__item:nth-child(4) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/4B/rBD-SWDdx22APzaqAAeU1R1yppY33.jpeg);
    }
    .el-carousel__item:nth-child(5) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/71/rBD-SWFMLrqAVFIRAAC6gAm5BEw177.jpg);
    }
    .el-carousel__item:nth-child(6) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/71/rBD-SWFMLwOAf8KTAAYoNhHLGLY303.JPG);
    }   
    .el-carousel__item:nth-child(7) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/71/rBD-SWFMLwOAf8KTAAYoNhHLGLY303.JPG);
    }  
    .el-carousel__item:nth-child(8) {
      background-image: url(http://121.199.29.84:8888/group1/M00/00/71/rBD-SWFMLwOAf8KTAAYoNhHLGLY303.JPG);
    } 
}
</style>

<style lang="scss" scope>
  .home{
    // height: 800px;
  .wrapper{
    .project{
      .title{
        font-size: 22px;
        padding: 2em 0;
        border-bottom:1px solid #f4f4f4 ;
      }
      .content{
        display: flex;
        .pic{
          height: 200px;
          width: 300px;
          background-color:#f4f4f4 ;
          border-radius: 5px;
          overflow: hidden;
        }
        .text{
          flex: 1;
          padding:1em 2em;
          div{
            line-height: 2em;
          }
        }
      }
      
    }
  }
  .question .box{
    padding-top: 20px;
    width: 1204px;
    margin: 0 auto;
  }
  .question .box .title{
    font-size: 20px;
    font-weight: bold;
    color: black;
  }
  .question .box .question{
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0;
    color: black;
  }
  .question .box p{
    margin: 14px 0px;
    text-indent: 2em;
    color: #999;
  }
  .question .pic{
    text-align: center;
  }
  .question .box .pic img{
    vertical-align: top;
}
}

</style>